<aside class="side-nav" id="sideNav">
    {% if user.is_authenticated %}  <!-- 如果已经登录 -->
        <ul class="nav-menu">

            <!-- 主菜单循环 -->
          {% for menu in menu_data %}
            {% if menu.has_permission %}
              <li class="nav-item menu-parent">
                <!-- 主菜单,添加 data-menu-id 标识 -->
                <div class="nav-link toggle-btn link-light hover-text-white pe-auto"
                     data-menu-id="menu-{{ forloop.counter }}"
                >
                  <span class="d-inline-flex align-items-center gap-0" onclick="loadMenu('{{ menu.name }}')">
                    <i class="{{ menu.icon }}" style="{{ menu.style }}"></i>{{ menu.name }}
                  </span>
                </div>

                <!-- 子菜单,添加 collapse 类 -->
                <ul class="sub-menu collapse" id="menu-{{ forloop.counter }}">
                  {% for sub_item in menu.sub_items %}
                    {% if sub_item.has_permission %}  <!-- 判断是否有子菜单权限 -->
                        <li class="nav-item">
                            <a href="javascript:void(0)"
                               class="nav-link text-white py-1"
                               onclick="loadContent('{{ sub_item.url }}', '{{ sub_item.name }}')">
                                <i class="{{ sub_item.icon }}"></i><span class="text-success">{{ sub_item.name }}</span>
                            </a>
                        </li>
                    {% endif %}
                  {% endfor %}
                </ul>

              </li>
            {% endif %}
          {% endfor %}

        </ul>
      {% else %}

         <!-- 未登录时显示的引导内容 -->
        <div class="guide-content">
            <i class="fas fa-lock fa-2x"></i>
            <h3>需要登录才能访问</h3>
            <a href="{% url 'account:auth_login' %}" class="login-btn">
                <i class="fas fa-sign-in-alt"></i> 立即登录
            </a>
        </div>
    {% endif %}
</aside>

